﻿<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="../../static/css/cloud-admin.css" >
	<link href="../../static/css/style.css" rel="stylesheet" type="text/css" media="all" />
	<link rel="stylesheet" type="text/css" href="../../static/css/iotxstyle.css" >
</head>
<body>
<!-- PAGE -->
<section>
	<!-- LOGIN -->
	<section id="login" class="visible">
		<div class="container">
			<div class="row">
				<div class="col-md-4 col-md-offset-4">
					<div class="login-box-plain">
						<h2 class="bigintro">Sign In</h2>
						<div class="divide-40"></div>
						<form role="form">
							<div class="form-group">
								<label style="margin-bottom:2%">Account</label>
								<input type="text" id="account" class="form-control" placeholder="Please enter account" style="margin-bottom:5%;height: 10%">
							</div>
							<div class="form-group">
								<label style="margin-bottom:2%">Password</label>
								<input type="password" id="password" class="form-control" placeholder="Please enter account" style="height: 10%">
							</div>

							<div class="form-group"style="margin-top: 20%;text-align:center;">
								<button id="tologin"  style="background: #179BD7;height: 50px;color: #FFFFFF;border:solid red 0px;border-radius: 40px;box-shadow: 0 1px 4px #73B9FF;">Login</button>
							</div>
							<div class="form-group" style="border-bottom:solid 1px #CECECE">
								<label style="margin-bottom:2%;margin-top: 2%;">Connection Status</label>
								<label style="margin-bottom:2%;margin-top: 2%;float: right">Disconnected</label>
							</div>
							<a href="#" style="float: right;margin-top: 10%">?Help</a>
						</form>
					</div>
				</div>

			</div>
		</div>
	</section>
</section>
<!-- JQUERY -->
<script src="../../static/js/jquery-2.0.3.min.js"></script>
<!-- JQUERY UI-->
<script src="../../static/js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
<!-- BOOTSTRAP -->
<script src="../../static/bootstrap-dist/js/bootstrap.min.js"></script>
<!-- CUSTOM SCRIPT -->
<script src="../../static/js/script.js"></script>
<script>
    $(document).ready(function(){
        $("#tologin").click(function(){
               var account = $("#account").val();
               var password = $("#password").val();
               if(!account || !password){
                   alert("请先输入账号和密码!");
                   return;
               }
               var  data = {
                   "login_account":account,
                   "login_pwd":password
               };
               $.ajax({
                      type: 'POST',
                      url: '/auth/login',
                      data: JSON.stringify(data),
                      contentType:'application/json',
                      dataType: 'json',
                      success: function(result){
                          if(result.status == 0){
                              alert("账号登录失败，请确认账号和密码是否正确");
                          }else{
                              window.location.href = result.data;
                          }
                          }
               });
           });
    });


</script>
</body>
</html>